<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Untitled</title>
<script type="text/javascript" src="../lib/dojo/dojo/dojo.js" data-dojo-config="'async':true,'parseOnLoad':true,'packages':[{'name':'maqetta','location':'../../maqetta'},{'name':'gridx','location':'../gridx'},{'name':'clipart','location':'../../clipart'},{'name':'shapes','location':'../../shapes'}], 'themeMap':[['Android','',['../themes/android/android.css']],['BlackBerry','',['../themes/blackberry/blackberry.css']],['iPad','',['../themes/ipad/ipad.css']],['iPhone','',['../themes/iphone/iphone.css']],['.*','',['../themes/iphone/iphone.css']]],'mblThemeFiles':[],'mblLoadCompatPattern':''"></script>
<script type="text/javascript">
require([
  "dijit/dijit",
  "dojo/parser",
  "maqetta/space",
  "maqetta/AppStates",
  "dojox/mobile",
  "dojox/mobile/deviceTheme",
  "dojox/mobile/compat",
  "dojo/hash"
]);
</script>
<style>@import "../themes/claro/claro.css";@import "../app.css";
</style>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"></meta>
<script type="text/javascript"  src="../app.js"></script>
</head>
<body class="claro" data-maq-device="iphone" data-maq-flow-layout="true" data-maq-ws="collapse" id="myapp">
 <div data-dojo-type="dojox/mobile/View" id="root_view" style="height: 100%;" selected="selected">
<h1 label="My Mobile App" data-dojo-type="dojox/mobile/Heading"></h1>
<ul data-dojo-type="dojox/mobile/RoundRectList">
  <li data-dojo-type="dojox/mobile/ListItem" moveTo="alerts_view">
    Alerts</li>
  <li data-dojo-type="dojox/mobile/ListItem">
  Status</li>
  <li data-dojo-type="dojox/mobile/ListItem">
    News</li>
</ul>
</div>
 <div data-dojo-type="dojox/mobile/View" id="alerts_view" style="height: 100%; display: none;">
  <h1 label="Alerts" data-dojo-type="dojox/mobile/Heading" back="Home" moveTo="root_view"></h1>
  <div style="margin: 1em;">
  Today's alerts:</div>
  <div style="margin-left: 1em;">
    10:30am 85% capacity</div>
</div>
</body>
</html>
